type FilterBarLayout = {
    // string -> static text
    // number -> bind to the name of the filter
    displayText : string | number,
    displayIcons : DefaultEmptyObject<{
        left ?: string,
        right ?: string
    }>,
    autoHide : DefaultFalse // whether hide the filter when any option is selected
    alignRight : DefaultFalse, // whether align right‘
    resettable : DefaultFalse, // whether has reset & confirm button
    filters : ({
        multiple : DefaultFalse, // whether multiple selection
        headerText ?: string,
        showHeaderText : DefaultFalse, // whether show header text
        alignRight : DefaultFalse, // whether align right
    } & (({
        type : "text" | "tag", // only style difference
        key: "categories" | "locations" | "sort_by" | "organizations",
        name : string | number,
        // default index -> required to select at least one option
        defaultIndices : DefaultEmptyArray<number[]>,
        currentIndices : DefaultEmptyArray<Appended<number[]>>,
        options : string[],
        optionsValue: any[],
    }) | {
        type : "date"
        name : string,
        currentDate : Appended<Date>
        defaultDate ?: Date
    }))[]
}[]

type DefaultFalse<T extends boolean = false> = T;
type DefaultTrue<T extends boolean = true> = T;
type Appended<T> = T;

type DefaultEmptyObject<T extends object = {}> = T;
type DefaultEmptyArray<T extends any[] = []> = T;
type ThisFilter = any;
